<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
	<%@include file="/pages/manager/common.jsp" %>
</head>
<body>

</body>
<script type="text/javascript">
var viewHight = viewHight || (function(){
	return document.documentElement.clientHeight * 1 - 80;
})();
var tabs = new Map();
Ext.onReady(function(){
	/*
	var treeStore = Ext.create('Ext.data.TreeStore',{
		proxy : {
			actionMethods: {  
	            read: 'GET'  
	        },
			type : 'ajax',
			url : "http://123.207.164.233:8080/manager/role/getMenuTree",
		},
		listeners : {
			"load" : function() {
			}
		},
		folderSort : false
	});*/
	var treeStore = Ext.create('Ext.data.TreeStore', {
	    root: {
	        expanded: true,
	        children: [
	            { id:'a',text: "detention", leaf: true,iconCls : '' },
	            { id:'b',text: "homework", expanded: true, children: [
	                { id:'d',text: "book report", leaf: true },
	                { id:'e',text: "alegrbra", leaf: true}
	            ] },
	            { id:'c',text: "buy lottery tickets", leaf: true }
	        ]
	    }
	});
	var treePanel = Ext.create("Ext.tree.TreePanel",{
		region: 'west',
	    height: '90%',
	    width : '15%',
	    border : 0,
	    title : '功能菜单',
	    split: false,
	    collapsible: true,
		rootVisible : false,
		frame : false,
		ddGroup : 'GridDD',
		checkModel : true,
		store : treeStore,
		useArrows : true,
		autoScroll : false,
		listeners:{
			itemclick : function(view, record, item, index, e, eOpts){
				if(record.data.leaf){
					var tabPanel = Ext.getCmp('center_tabpanel');
					if(!tabs.get(record.data.id)){
						var tab = {
							closable : true,
					        title : record.data.text,
					        html: '<iframe src="/pages/manager/content.jsp" width="100%" height="'+viewHight+'" frameborder=0></iframe>',
					        //html : record.data.text,
					        closeAction : 'destroy',
					        id : record.data.id + '-tab',
					        listeners : {
					        	'destroy' : function(){
					        		tabs.remove(record.data.id);
					        	}
					        }
						};
						tabPanel.add(tab);
						tabs.put(record.data.id,tab);
						tabPanel.setActiveTab(tabPanel.getComponent(record.data.id + '-tab'));
					}
					else{
						tabPanel.setActiveTab(tabPanel.getComponent(record.data.id + '-tab'));
					}
				}
		    }
		}
	});
	
	var win = Ext.create("Ext.Window", {
		width : '100%',
		height : '100%',
		draggable : false,
		closable : false,
		layout : 'border',
		renderTo : Ext.getBody(),
		resizable : false,
		autoScroll : false,
		buttonAlign : 'center',
		closeAction : 'hide',
		listeners :{
		},
		items: [
		treePanel,
		{
		    region: 'north',
		    xtype: 'panel',
		    height: 40,
		    width : '100%',
		    border: 0,
		    html: 'Content appropriate for the current navigation'
		},
		{
		    region: 'center',
		    xtype: 'tabpanel',
		    width: '100%',
		    height: '100%',
		    id : 'center_tabpanel',
		    items:[{
		        closable : false,
		        title : '首页',
		        html: '<h2>Content appropriate for the current navigation.</h2>'
		    }]
		}
		]
	});
	win.show();
});
</script>
</html>
